{% extends "base.html" %}
{% load comments %}
{% load i18n %}
{% load account socialaccount %}


{% block title %}留言{% endblock %}
{% block content %}
<HEAD>

<!-- 控制宽度的自动适应 -->
<style type="text/css">
.comments {
 width:100%;/*自动适应父布局宽度*/
 overflow:auto;
 word-break:break-all;
/*在ie中解决断行问题(防止自动变为在一行显示，主要解决ie兼容问题，ie8中当设宽度为100%时，文本域类容超过一行时，
当我们双击文本内容就会自动变为一行显示，所以只能用ie的专有断行属性“word-break或word-wrap”控制其断行)*/
}
</style>

	<script>
function beforeSubmit(form){
if(form.id_name.value==''){
 form.id_name.value='游客'
}
if(form.id_comment.value==''){
alert('留言不能为空');
return false;
}
}
</script>
</HEAD>
<div class="container">
	<div class="row clearfix">
			<div class="col-md-12 column">
			<!-- 文章内容 -->      
			 
			      <div class="panel panel-default">
					    <div class="panel-heading">
					        <h4>如果没有登录，将以游客的昵称留言</h4>
					    </div>
						<form id="comment_form" 
						      class="form-horizontal"
						      method="post"
							   onSubmit="return beforeSubmit(this)"
						> 
						    {% csrf_token %}
 							<input type="hidden"
			                   id="id_name" class="input-xlarge" name="name" 
			                   placeholder="请输入昵称" 
			                   value="{{ dl_user }}" />
			                   
						    <div class="control-group">
						        <div class="controls"  >
						          <textarea rows="8"
			                      id="id_comment" class="comments"  name="comment"
			                      placeholder="请给我留言吧"></textarea>
						        </div>
						    </div>
						    {# 表单按钮 #}
						    <div class="controls">
						        <div class="form-actions">
						            <input class="btn btn-info" id="submit_btn" type="submit" name="submit" value="提交"/>
						        </div>
						    </div>
						 </form>
		
				  </div>
			</div>
	
	</div>
	 
<!-- 	留言显示BEGIN -->
	<div class="row clearfix">
		<div class="col-md-12 column">
		
		{% for i in ly_all%}
			<div class="panel panel-default">
				<div class="panel-heading">
					<h3 class="panel-title">
						{{i.name}}#{{i.created_time}}留言：
					</h3>
				</div>
				<div class="panel-body">
					{{i.say}}
				</div>
			</div>
		{%endfor%}
				<!-- 	留言显示END -->

			<div class="panel panel-default">
				<div class="panel-heading">

					 <a href="?page=1">首页</a>
						{% if ly_all.has_previous %}
						<a href="?page={{ ly_all.previous_page_number }}">上一页</a>
						{% endif %}
						  当前第 {{ ly_all.number }}页/ 共   {{ ly_all.paginator.num_pages }} 页

						   {% if ly_all.has_next %}
	              			<a href="?page={{ ly_all.next_page_number }}">下一页</a>
	          				{% endif %}
			 			 <a href="?page={{ ly_all.paginator.num_pages }}">尾页</a>
				</div>
			</div>


		</div>
	</div>
</div>
{% endblock %}
{% block right %}
{% include 'right.html' %}
{%  endblock %}
